<%--
  Created by IntelliJ IDEA.
  User: fengxuanzhen
  Date: 14-4-20
  Time: 上午10:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <%@include file="../../../includes/common.jsp" %>
    <script src="<c:url value="/js/common/scormAPI/administratorScormAPI.js"/>" type="text/javascript"></script>
    <title>课件观看</title>
</head>
<body>

<div id="mainContent" class="easyui-layout" data-options="fit:true" style="padding: 10px">
    <div data-options="region:'west',split:true,title:'章节树'"
         style="width:300px;;border: 1px solid #95B8E7;float: left;overflow-x:auto;padding:10px;">

        <div id="menuTree" class="ztree"
             style="width:100%;border: 1px solid #95B8E7;float: left;overflow-x:auto ">
        </div>
    </div>
    <div data-options="region:'center',title:'课件观看'" id="centerDiv">
        <input type="hidden" id="domValue" value=""/>
        <input type="hidden" id="domHref" value=""/>

        <div id="tabParentDiv" style="width:100%;height: 100%">
            <iframe style="width: 100%; height: 100%" id="course" src="${scormNodes[0].chapterUrl}">您的浏览器不支持该课件播放</iframe>
        </div>
    </div>

    <div id="dataEdit" closed="true" modal="true" style="overflow: hidden">
        <iframe style="width: 100%;height: 100%"
                id="contentList"
                name="contentList"
                marginheight="0"
                marginwidth="0"
                frameborder="0" src=""
                allowTransparency="true">
        </iframe>
    </div>

</div>

</body>
</html>
<script type="text/javascript">
    var zNodesMenu;
    var zTree;

    var settingMenu = {
        view: {
            expandSpeed: "fast"
        },
        data: {
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "pId"
            },
            key: {
                name: "name"
            },
            keep: {
                parent: true
            }
        },
        callback: {
            onClick: zTreeOnClick
        }
    };

    var zNodes = [
        <c:forEach var="MenuPerm" items="${scormNodes}">
        {id: "${MenuPerm.xmlChapterId}", pId: "${MenuPerm.parentId}", name: "${MenuPerm.chapterName}", href: "${MenuPerm.chapterUrl}", sco: "${MenuPerm.id}"},
        </c:forEach>
    ];

    function zTreeOnClick(event, treeId, treeNode) {
        if (treeNode.href == "") {
            $.messager.alert("提示", "请选择正确的节点！", "", function () {
            });
        } else {
            $("#domValue").attr("value", treeNode.sco);
            $("#domHref").attr("value", treeNode.href);
//            selectEnterType(treeNode.sco, treeNode.href);   用户
            $("#course").attr("src", treeNode.href);
        }
    }

    function selectEnterType(id, href) {
        $.messager.confirm("提交", "是否继续上次观看？", function (r) {
            if (r) {
                $.ajax({
                    url: basePath + "courseRegister/selectEnterType",
                    async: false,
                    data: {
                        id: id,
                        entry: "resume"
                    },
                    dataType: "json",
                    type: "POST",
                    success: function () {
                        $("#course").attr("src", href);
                    },
                    error: doError
                })
            }
            else {
                $.ajax({
                    url: basePath + "courseRegister/selectEnterType",
                    async: false,
                    data: {
                        id: id,
                        entry: "ab-initio"
                    },
                    dataType: "json",
                    type: "POST",
                    success: function () {
                        $("#course").attr("src", href);
                    },
                    error: doError
                })
            }

        })
    }

    $(document).ready(function () {
        $.fn.zTree.init($("#menuTree"), settingMenu, zNodes);
        var treeObj = $.fn.zTree.getZTreeObj("menuTree");
        treeObj.expandAll(true);
        var height = document.documentElement.clientHeight - 95;
        $("#menuTree").height(height);
    });


</script>
